/* global $ */

// 颜色选择初始说明
// 每一个颜色input都有一个inori-data,内容为对应元素的id或者对应元素的父元素id（迭代用）

$(document).ready(function () {
  $('#color1').colorPicker(
    {
      onColorChange: function (id, newValue) {
        let targetID = $(this).prev('input').attr('inori-data')
        let targetEle = $(`#${targetID} input`)
        for (let ele of targetEle) {
          $(ele).val(newValue)
        }
        console.log(`ID: ${id} has been changed to ${newValue}`)
      }
    }
  )
  $('#color1').change()

  // 初始化其他color
  // 其余颜色选择器集合
  let otherColorPickers = $('.color_picker_others')
  // 循环集合
  for (let e of otherColorPickers) {
    let id = $(e).attr('inori-data')

    if (id === 'danwei_color' ||
      id === 'peiou_color' ||
      id === 'zhixi_color' ||
      id === 'qingsu_color' ||
      id === 'tongshi_color' ||
      id === 'pengyou_color') {
      // 自定后缀的
      $(e).colorPicker(
        {
          onColorChange: function (id, newValue) {
            // 本体
            let targetID = $(this).prev('input').attr('inori-data')
            let targetEle = $(`#${targetID}`)
            $(targetEle).val(newValue)
            // 自定义
            let targetAltID = targetID.replace(/(\w+)(_color)/, '$1_zidingyi$2')
            let targetAltEle = $(`#${targetAltID}`)
            $(targetAltEle).val(newValue)

            console.log(`ID: ${id} has been changed to ${newValue}`)
          }
        }
      )
      $(e).change()
      // end 自定后缀的
    } else if (id === 'jinjian_nianling_min_color') {
      // 特殊对应的
      $(e).colorPicker(
        {
          onColorChange: function (id, newValue) {
            // 本体
            let targetID = $(this).prev('input').attr('inori-data')
            let targetEle = $(`#${targetID}`)
            $(targetEle).val(newValue)
            // 自定义
            let targetAltID = `jinjian_nianling_max_color`
            let targetAltEle = $(`#${targetAltID}`)
            $(targetAltEle).val(newValue)

            console.log(`ID: ${id} has been changed to ${newValue}`)
          }
        }
      )
      $(e).change()
      // end 特殊对应的
    } else if (id === 'kaohe_color') {
      // 考核需要一起搞到考察里边
      $(e).colorPicker(
        {
          onColorChange: function (id, newValue) {
            // kaohe
            let targetID = $(this).prev('input').attr('inori-data')
            let targetEle = $(`#${targetID}`)
            $(targetEle).val(newValue)
            // kaocha
            let kaochaEle = $(`#kaocha_color`)
            $(kaochaEle).val(newValue)

            console.log(`ID: ${id} has been changed to ${newValue}`)
          }
        }
      )
      $(e).change()
      // end 考核需要一起搞到考察里边
    } else {
      // 只有一个对应
      $(e).colorPicker(
        {
          onColorChange: function (id, newValue) {
            let targetID = $(this).prev('input').attr('inori-data')
            let targetEle = $(`#${targetID}`)
            $(targetEle).val(newValue)
            console.log(`ID: ${id} has been changed to ${newValue}`)
          }
        }
      )
      $(e).change()
      // end 只有一个对应
    }
  }
})
